<template>
    <div class="hngkContent">
        <BigTitle />
        <SideMenu />
        <div class="sjhjLeft">
            <div>
                <SjhjLeftOne />
            </div>
        </div>
        <SjhjCenter v-show="$store.state.sjhjCenterShow"></SjhjCenter>
        <!--  -->
        <div class="sjhjRight">
            <div>
                <SjhjRightOne />
                <SjhjRightTwo />
            </div>
        </div>
    </div>
</template>

<script>
import BigTitle from "./BigTitle";
import SideMenu from "./SideMenu";
import SjhjLeftOne from "./sjhjLeft/SjhjLeftOne";
import SjhjRightOne from "./sjhjRight/SjhjRightOne";
import SjhjRightTwo from "./sjhjRight/SjhjRightTwo";
import SjhjCenter from "./sjhjCenter/SjhjCenter";
import {
    defineComponent,
    getCurrentInstance,
    onMounted,
    ref,
    provide,
    onBeforeUnmount,
} from "vue";
import { useRouter } from "vue-router";
export default defineComponent({
    components: {
        BigTitle,
        SideMenu,
        SjhjLeftOne,
        SjhjRightOne,
        SjhjRightTwo,
        SjhjCenter,
    },
    setup() {
        onBeforeUnmount(() => {
            layerManager.removeAll();
        });
        return {};
    },
});
</script>

<style lang="stylus" scoped>
@media (max-width: 2880px) {
    .sjhjLeft {
        leftContent();
    }

    .sjhjRight {
        rightContent();
    }
}
</style>
<style lang="stylus" scoped>
@media (min-width: 3000px) {
    .sjhjLeft {
        leftContent3840()
    }
    .sjhjRight {
        rightContent3840()
    }
}
</style>